// 入口函数
$(function () {
  // 1. 点击a链接，显示隐藏
  $('#loginBox a').on('click', function () {
    //   点击a链接，显示注册区域，隐藏登录区域
    $('#loginBox').hide()
    $('#regBox').show()
  })

  $('#regBox a').on('click', function () {
    //   点击a链接，显示登录区域，隐藏注册区域
    $('#regBox').hide()
    $('#loginBox').show()
  })

  //   2. 表单自定义校验规则
  //   console.log(lsyui)
  let form = layui.form
  //   自定义校验规则，layui.form()
  //   参数是对象，属性是校验名称，值是校验规则
  form.verify({
    //   属性是校验名称，值是校验规则
    //   值有两种类型：函数和数组
    username: [/^[a-zA-Z0-9]{1,10}$/, '用户名必须1到10位数字和字母'],
    pwd: [/^[a-zA-Z0-9]{6,12}$/, '密码必须6到12位数字和字母'],
    rePwd: function (value) {
      // value就是你给哪个标签添加这个校验规则
      // 这个标签的值就赋值给value
      console.log(value)
      let pwd = $('#regBox input[name="password"]').val()
      if (pwd != value) {
        return '两次密码输入不一致'
      }
    }
  })

  // 3.注册功能
  let layer = layui.layer //使用layui之前，需要使用变量接收
  $('#formReg').on('submit', function (e) {
    // 阻止表单默认行为
    e.preventDefault()

    // 发送ajax
    axios({
      method: 'post',
      url: '/api/reguser',
      // 不要传递对象类型，因为对象类型头信息设置得是application/json
      // content-type:application/json，目前接口文档不支持
      data: $(this).serialize() //a=1&b=2&c=3 使用serialize()必须带有name属性
    }).then(res => {
      //成功回调
      // console.log(res.data)

      if (res.data.status != 0) {
        // 清空表单
        $('#formReg')[0].reset()

        // 美化提示框
        return layer.msg(res.data.message)
      }

      // 成功提示，美化提示框，layui里面的方法
      layer.msg('恭喜您，注册成功')

      // 清空表单
      $('#formReg')[0].reset()

      // 注册完成切换至登录页面
      $('#regBox a').click()
    })
  })

  // 4.登录功能
  $('#formLogin').on('submit', function (e) {
    // 阻止表单默认行为
    e.preventDefault()

    axios({
      method: 'post',
      url: '/api/login',
      data: $(this).serialize()
    }).then(({ data: res }) => {
      //成功回调
      // console.log(res)

      if (res.status != 0) {
        return layer.msg(res.message)
      }

      // 提示成功，美化提示框
      layer.msg('恭喜您，登录成功')

      // 页面跳转到index
      location.href = '/index.html'

      // 本地存储token
      localStorage.setItem('token', res.token)
    })
  })
})
